<template>
  <UserCardList :userList="userList" />
</template>

<script setup lang="ts">
import { searchUserByTags } from '@/api/search/search'
import type { UserType } from '@/modules/user'
import { onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import UserCardList from '@/components/UserCardList/index.vue'

const route = useRoute()
const { tags } = route.query

const userList = ref<UserType[]>([])

onMounted(() => {
  getUserList()
})

const getUserList = () => {
  searchUserByTags(tags).then((res) => {
    const { code, data } = res
    if (code === 200) {
      userList.value = data
      userList.value.forEach((item) => {
        if (item.tags) {
          item.tags = JSON.parse(item.tags)
        }
      })
    }
  })
}
</script>
